<template>
	<div>
		main /{{ userInfo }}
		<button @click="btnFn">btn</button>
		<button @click="btnFn3">btn1</button>
		<mains :name="userInfo" />
	</div>
</template>

<script>
import { mapActions, mapState } from 'vuex';
import mains from './mains.vue';
export default {
	components: { mains },
	data() {
		return {};
	},
	computed: {
		...mapState(['userInfo'])
	},
	mounted() {},
	methods: {
		promise() {
			return new Promise((resolve, reject) => {
				setTimeout(() => {
					resolve(111);
				}, 2000);
			});
		},
		async btnFn1() {
			const res = await this.promise();
			console.log(res);
			return res;
		},
		btnFn2() {
			console.log('btn2');
		},
		btnFn() {
			const s = this.btnFn1();
			console.log(s);
			this.btnFn2();
		},
		...mapActions(['getUserInfo']),
		btnFn3() {
			// this.getUserInfo({a:3})
			// this.$store.dispatch("getUserInfo",{a:3});
			var userInfo = { a: 3 };
			this.$store.commit('receive_user_info', { userInfo });
		}
	},

	watch: {}
};
</script>

<style scoped lang="less"></style>
